<template>
    <div>
        <ActivityNav :nav="nav" :path="path"></ActivityNav>

        <TitelHearder :list="list1"></TitelHearder>
        <TabalNav :list="list2"></TabalNav>
        <template v-for="(item,index) in Arr">
            <template v-if="item">
                <!-- <template v-if="Arr[0]">
                    <TitelImg :list="Arr[0].data[0]"></TitelImg>
                </template>
                <template v-if="Arr[1]">
                    <ProductList :list="Arr[1].data.ids"></ProductList>
                </template> -->
                <template v-if="index==0 || index%2 ==0">
                    <div :key="index">
                        <!-- <p>{{item.data[0]}}</p> -->
                        <TitelImg :list="item.data[0]"></TitelImg>
                    </div>
                </template>
                <template v-if="index%2!==0">
                    <div :key="index">
                        <!-- <p>{{item.data[0]}}</p> -->
                        <ProductList :list="item.data.ids"></ProductList>
                    </div>
                </template>
            </template>
        </template>

        <!-- <template v-for="(item,index) in Arr">
            <template v-if="index==0 || index%2 !==0">
                <TitelImg :key="index" :list="item.data[0]"></TitelImg>
            </template>
            <template>
                <ProductList :key="index+100" :list="item.data.ids"></ProductList>
            </template>
        </template> -->
    </div>
</template>

<script>
import ActivityNav from "../components/Activity/ActivityNav.vue";
export default {
    components: { ActivityNav },
    data() {
        return {
            nav: "",
            path: "",
            list1: {},
            list2: {},
            Arr: [],
        };
    },
    async created() {
        let data = await this.$API.ActivityAPI.GetActivityPageId(
            this.$route.params
        );
        this.nav = data.data.pageName;
        this.list1 = data.data.data[0];
        this.list2 = data.data.data[1];
        this.Arr = data.data.data.filter((item, index) => {
            if (index > 1) {
                return true;
            }
        });
        console.log(this.Arr);
    },
    beforeRouteEnter(to, from, next) {
        next((vm) => {
            vm.path = from.path;
        });
    },
    async beforeRouteUpdate(to, from, next) {
        let data = await this.$API.ActivityAPI.GetActivityPageId(
            this.$route.params
        );
        this.nav = data.data.pageName;
        this.list1 = data.data.data[0];
        this.list2 = data.data.data[1];
        this.Arr = data.data.data.filter((item, index) => {
            if (index > 1) {
                return true;
            }
        });

        next();
        this.$router.go(0)
    },
};
</script>

<style>
</style>